<%-- 
    Document   : newEditServicio
    Created on : 27/05/2014, 03:43:10 PM
    Author     : USUARIO
--%>
<%
    session.setAttribute("sesHor", null);
%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>AdminLTE | Dashboard</title>
        <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
        <!-- bootstrap 3.0.2 -->
        <link href="../../css/bootstrap.min.css" rel="stylesheet" type="text/css" />
        <!-- font Awesome -->
        <link href="../../css/font-awesome.min.css" rel="stylesheet" type="text/css" />
        <!-- Ionicons -->
        <link href="../../css/ionicons.min.css" rel="stylesheet" type="text/css" />
        <!-- Theme style -->
        <link href="../../css/AdminLTE.css" rel="stylesheet" type="text/css" />

        <script type="text/javascript">
            function agregarHor()
            {   var hor = $("#hor").val();
                $("#divHor").load("../../ServletServicio?accion=addHorario",{hor:hor});
            }
            function eliminarHor(id)
            {   $("#divHor").load("../../ServletServicio?accion=addHorario",{id:id});
            }
            
            function agregarEsc()
            {   var esc = $("#nomEsc").val();
                $("#divTipSer").load("../../ServletServicio?accion=addEscala",{esc:esc});
            }
            function eliminarEsc(id)
            {   $("#divTipSer").load("../../ServletServicio?accion=addEscala",{id:id});
            }
        </script>
    </head>
    <body class="skin-blue">            
        
        <!-- header logo: style can be found in header.less -->
        <%@include file="../../jspf/header.jspf" %>
        <!-- header logo: style can be found in header.less -->        
        
        <div class="wrapper row-offcanvas row-offcanvas-left">
            <!-- Left side column. contains the logo and sidebar -->
            <aside class="left-side sidebar-offcanvas">                
                <!-- sidebar: style can be found in sidebar.less -->
                <section class="sidebar">
                    <!-- Sidebar user panel -->
                    <div class="user-panel">
                        <div class="pull-left image">
                            <img src="../../img/avatar3.png" class="img-circle" alt="User Image" />
                        </div>
                        <div class="pull-left info">
                            <p>Hello, Jane</p>

                            <a href="#"><i class="fa fa-circle text-success"></i> Online</a>
                        </div>
                    </div>
                    <!-- search form -->
                    <form action="#" method="get" class="sidebar-form">
                        <div class="input-group">
                            <input type="text" name="q" class="form-control" placeholder="Search..."/>
                            <span class="input-group-btn">
                                <button type='submit' name='seach' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
                            </span>
                        </div>
                    </form>
                    <!-- /.search form -->
                    
                    <!-- sidebar menu: : style can be found in sidebar.less -->
                    <%@include file="../../jspf/menu.jspf" %>
                    <!-- sidebar menu: : style can be found in sidebar.less -->
                    
                </section>
                <!-- /.sidebar -->
            </aside>

            <!-- Right side column. Contains the navbar and content of the page -->
            <aside class="right-side">                
                <!-- Content Header (Page header) -->
                <section class="content-header">
                    <h1>
                        Servicio
                        <small>Mantenedor</small>
                    </h1>
                    <ol class="breadcrumb">
                        <li><a href="#"><i class="fa fa-dashboard"></i> Dashboard</a></li>
                        <li class="active">Itinerario</li>
                    </ol>
                </section>

                <!-- Main content -->
                <section class="content">
                    
                    <% String msg = request.getParameter("msg");
                        if(msg!=null)
                        {
                    %>
                    <div class="col-xs-7">
                        <div class="alert alert-success alert-dismissable">
                            <i class="fa fa-check"></i>
                            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times</button>
                            <b>Confirmación!&nbsp;</b> <%=msg%>
                        </div>
                    </div>
                    <%
                        }
                    %>
                    
                    <div class="row">
                        <!-- left column -->
                        <div class="col-md-12">
                            <!-- general form elements -->
                            <div class="box box-primary">
                                <div class="box-header">
                                    <h3 class="box-title">Registro de Servicio</h3>
                                </div><!-- /.box-header -->
                                <!-- form start -->
                                <form role="form" method="post" action="../../controlador">
                                    <input type="hidden" value="operServ" name="accion"/>
                                    <input type="hidden" value="I" name="accionBD"/>
                                    <% Integer iduser = (Integer)session.getAttribute("iduser"); %>
                                    <input type="hidden" value="<%=iduser%>" name="user"/>
                                    <input type="hidden" value="0" name="idSer"/>
                                    <div class="box-body">
                                        <div class="row">
                                            <div class="col-xs-4">
                                                <label>Nombre de Servicio</label>
                                                <input name="sNom" type="text" class="form-control" placeholder="Nombre de Servicio">
                                            </div>
                                            <div class="col-xs-4">
                                                <label>Ruta</label>
                                                <select class="form-control" name="sIdRut">
                                                    <% ModIti_Ruta r = new ModIti_Ruta();
                                                       ArrayList<ModIti_Ruta> list = r.listarRutas();
                                                       for(int i=0; i<list.size(); i++)
                                                       {
                                                    %>
                                                    <option value="<%=list.get(i).getId()%>">
                                                        <%=list.get(i).getOrigen()%> &#8212; <%=list.get(i).getDestino()%>
                                                    </option>
                                                    <%
                                                       }
                                                    %>
                                                </select>
                                            </div>
                                            <div class="col-xs-4">
                                                <label>Tipo de Servicio</label>
                                                <select class="form-control" id="tipser" onchange="cambiarTS(this)" name="sTipSer">
                                                    <option value="Directo">Directo</option>
                                                    <option value="Escala">Escala</option>
                                                    <option value="Ambas">Ambas</option>
                                                </select>
                                            </div>
                                        </div><br/>
                                        <div class="row" id="nEscAmb" style="display:none;">
                                            <div class="col-xs-4">
                                                <label>Escala</label>
                                                <div class="input-group margin" style="margin-left:0px;margin-top:0px;">
                                                    <select class="form-control" id="nomEsc" name="sNomEsc">
                                                        <option value="Abancay">Abancay</option>
                                                        <option value="Andahuaylas">Andahuaylas</option>
                                                        <option value="Arequipa">Arequipa</option>
                                                        <option value="Ayacucho">Ayacucho</option>
                                                        <option value="Ayaviri">Ayaviri</option>
                                                        <option value="Azángaro">Azángaro</option>
                                                        <option value="Bagua">Bagua</option>
                                                        <option value="Bagua Grande">Bagua Grande</option>
                                                        <option value="Barranca">Barranca</option>
                                                        <option value="Cajamarca">Cajamarca</option>
                                                        <option value="Cañete">Cañete</option>
                                                        <option value="Casma">Casma</option>
                                                        <option value="Catacaos">Catacaos</option>
                                                        <option value="Cerro de Pasco">Cerro de Pasco</option>
                                                        <option value="Chachapoyas">Chachapoyas</option>
                                                        <option value="Chancay">Chancay</option>
                                                        <option value="Chepén">Chepén</option>
                                                        <option value="Chiclayo">Chiclayo</option>
                                                        <option value="Chimbote">Chimbote</option>
                                                        <option value="Chincha">Chincha Alta</option>
                                                        <option value="Chota">Chota</option>
                                                        <option value="Chulucanas">Chulucanas</option>
                                                        <option value="Cusco">Cusco</option>
                                                        <option value="Cutervo">Cutervo</option>
                                                        <option value="Espinar">Espinar</option>
                                                        <option value="Ferreñafe">Ferreñafe</option>
                                                        <option value="Guadalupe">Guadalupe</option>
                                                        <option value="Huacho">Huacho</option>
                                                        <option value="Huancavelica">Huancavelica</option>
                                                        <option value="Huancayo">Huancayo</option>
                                                        <option value="Huanta">Huanta</option>
                                                        <option value="Huánuco">Huánuco</option>
                                                        <option value="Huaral">Huaral</option>
                                                        <option value="Huaraz">Huaraz</option>
                                                        <option value="Huarmey">Huarmey</option>
                                                        <option value="Ica">Ica</option>
                                                        <option value="Ilave">Ilave</option>
                                                        <option value="Ilo">Ilo</option>
                                                        <option value="Iquitos">Iquitos</option>
                                                        <option value="Jaén">Jaén</option>
                                                        <option value="Jauja">Jauja</option>
                                                        <option value="Juanjuí">Juanjuí</option>
                                                        <option value="Juliaca">Juliaca</option>
                                                        <option value="La Oroya">La Oroya</option>
                                                        <option value="Lambayeque">Lambayeque</option>
                                                        <option value="Lima Metropolitana">Lima Metropolitana</option>
                                                        <option value="Mollendo">Mollendo</option>
                                                        <option value="Monsefú">Monsefú</option>
                                                        <option value="Moquegua">Moquegua</option>
                                                        <option value="Moyobamba">Moyobamba</option>
                                                        <option value="Nazca">Nazca</option>
                                                        <option value="Pacasmayo">Pacasmayo</option>
                                                        <option value="Paita">Paita</option>
                                                        <option value="Paramonga">Paramonga</option>
                                                        <option value="Pisco">Pisco</option>
                                                        <option value="Piura">Piura</option>
                                                        <option value="Pucallpa">Pucallpa</option>
                                                        <option value="Puerto Maldonado">Puerto Maldonado</option>
                                                        <option value="Puno">Puno</option>
                                                        <option value="Quillabamba">Quillabamba</option>
                                                        <option value="Rioja">Rioja</option>
                                                        <option value="Sechura">Sechura</option>
                                                        <option value="Sicuani">Sicuani</option>
                                                        <option value="Sullana">Sullana</option>
                                                        <option value="Tacna">Tacna</option>
                                                        <option value="Talara">Talara</option>
                                                        <option value="Tarapoto">Tarapoto</option>
                                                        <option value="Tarma">Tarma</option>
                                                        <option value="Tingo">Tingo María</option>
                                                        <option value="Trujillo">Trujillo</option>
                                                        <option value="Tumbes">Tumbes</option>
                                                        <option value="Yurimaguas">Yurimaguas</option>
                                                        <option value="Zarumilla">Zarumilla</option>
                                                    </select>
                                                    <span class="input-group-btn">
                                                        <button class="btn btn-info btn-flat" type="button" onclick="agregarEsc()">Agregar</button>
                                                    </span>
                                                </div>
                                            </div>
                                            <div class="col-xs-4">
                                                <div id="divTipSer">
                                                </div>                                               
                                            </div><br/>
                                        </div>
                                        <div class="row">
                                            <div class="col-xs-4">
                                                <label>Horario</label>
                                                <select class="form-control" id="tiphor" onchange="cambiar(this)" name="sHor">
                                                    <option value="Libre">Libre</option>
                                                    <option value="Escala">Intervalo</option>
                                                </select>
                                            </div>
                                        </div><br/>
                                        <div class="row" id="nEscala" style="display:none;">
                                            <div class="col-xs-2">
                                                <label>Desde</label>
                                                <input type="time" name="sHorDes" class="form-control"/>
                                            </div>
                                            <div class="col-xs-2">
                                                <label>Hasta</label>
                                                <input type="time" name="sHorHas" class="form-control"/>                                             
                                            </div>
                                            <div class="col-xs-3">
                                                <label>Con un intervalo en minutos de</label>
                                                <input type="text" name="sHorInt" class="form-control" placeholder="ejemplo: 15"/>                                             
                                            </div><br/>
                                        </div>
                                        <div class="row" id="nLibre">
                                            <div class="col-xs-4">
                                                <label>Agregar Horario</label>
                                                <div class="input-group margin" style="margin-left:0px;margin-top:0px;margin-bottom:0px;">
                                                    <input type="time" id="hor" class="form-control">
                                                    <span class="input-group-btn">
                                                        <button class="btn btn-info btn-flat" type="button" onclick="agregarHor()">Agregar</button>
                                                    </span>
                                                </div>
                                            </div>
                                            <div class="col-xs-3">
                                                <div id="divHor">
                                                </div>                                               
                                            </div>
                                        </div>
                                    </div><!-- /.box-body -->

                                    <div class="box-footer">
                                        <button type="submit" class="btn btn-primary">Registrar Servicio</button>
                                        <a href="listServicio.jsp">
                                            <button type="button" class="btn btn-primary">Cancelar</button>
                                        </a>
                                    </div>
                                </form>
                            </div><!-- /.box -->
                        </div>
                    </div>
                    
                </section><!-- /.content -->
            </aside><!-- /.right-side -->
        </div><!-- ./wrapper -->


        <!-- jQuery 2.0.2 -->
        <script src="../../js/jquery.min.js"></script>
        <!-- Bootstrap -->
        <script src="../../js/bootstrap.min.js" type="text/javascript"></script>
        <!-- AdminLTE App -->
        <script src="../../js/app.js" type="text/javascript"></script>

        <script type="text/javascript">
            function cambiar(sel)
            {   if(sel.value == "Libre")
                {   $("#nLibre").show();
                    $("#nEscala").hide();
                } else
                {   $("#nLibre").hide();
                    $("#nEscala").show();
                }
            }
            function cambiarTS(sel)
            {   if(sel.value == "Escala" || sel.value == "Ambas")
                {   $("#nEscAmb").show();
                } else
                {   $("#nEscAmb").hide();
                }
            }
        </script>
        
    </body>
</html>

